<!--
  ~ ***** BEGIN LICENSE BLOCK *****
  ~ Version: MPL 1.1
  ~
  ~ The contents of this file are subject to the Mozilla Public License Version
  ~ 1.1 (the "License"); you may not use this file except in compliance with
  ~ the License. You may obtain a copy of the License at
  ~ http://www.mozilla.org/MPL/
  ~
  ~ Software distributed under the License is distributed on an "AS IS" basis,
  ~ WITHOUT WARRANTY OF ANY KIND, either express or implied. See the License
  ~ for the specific language governing rights and limitations under the
  ~ License.
  ~
  ~ The Original Code is Topless JSF.
  ~
  ~ The Initial Developer of the Original Code is
  ~ Marco Antonio Villalobos, Jr. (mvillalobos@kineteque.com).
  ~ Portions created by the Initial Developer are Copyright (C) 2010
  ~ the Initial Developer. All Rights Reserved.
  ~
  ~ Contributor(s):
  ~
  ~ Marco Antonio Villalobos, Jr. (mvillalobos@kineteque.com).
  ~
  ~ ***** END LICENSE BLOCK *****
  -->

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:c="http://java.sun.com/jsp/jstl/core"
      xmlns:fn="http://java.sun.com/jsp/jstl/functions"
      xmlns:topless="http://java.sun.com/jsf/composite/components/topless"
      xmlns:tfn="http://kineteque/topless/jsf">
    <h:head>
        <title>Topless Table Example</title>
    </h:head>

    <body>
        <f:view>
            <h:form id="f">
                <h:outputText value="Current time during first page request: #{timeRequest.current}"/>
                <c:set var="includes" scope="request">
                    ["WIDGET_ID","NAME","DESCRIPTION","PRICE","ACTIVE","CREATE_TIME"]
                </c:set>
                <topless:table
                        id="m"
                        binding="#{complexRequest.toplessTable}"
                        dataSource="#{appConfig.dataSource}"
                        query="select * from widgets"
                        includes="#{tfn:jsonArrayToList(requestScope.includes)}"
                        rows="10">
                    <f:facet name="ascOrder"> a </f:facet>
                    <f:facet name="descOrder"> d </f:facet>

                    <h:column id="s">
                        <h:selectBooleanCheckbox id="cb"/>
                    </h:column>

                    <ui:decorate template="/components/topless/columns.xhtml">
                        <ui:param name="first" value="0"/>
                        <ui:param name="columns" value="3"/>
                        <ui:define name="ascSort"> a </ui:define>
                        <ui:define name="descSort"> d </ui:define>
                    </ui:decorate>

                    <h:column>
                        <ui:decorate template="/components/topless/header.xhtml">
                            <ui:param name="col" value="ACTIVE"/>
                            <ui:param name="index" value="3"/>
                            <ui:define name="asc"> a </ui:define>
                            <ui:define name="desc"> d </ui:define>
                        </ui:decorate>
                        <h:selectBooleanCheckbox id="cbx" value="#{row['ACTIVE'] eq 1}" valueChangeListener="#{complexRequest.change}" >
                            <f:ajax execute="cbx"/>
                        </h:selectBooleanCheckbox>
                    </h:column>

                    <ui:decorate template="/components/topless/columns.xhtml">
                        <ui:param name="first" value="4"/>
                        <ui:param name="columns" value="2"/>
                        <ui:define name="ascSort"> a </ui:define>
                        <ui:define name="descSort"> d </ui:define>
                    </ui:decorate>

                    <h:column>
                        <h:commandLink id="r" value="Remove"
                                       immediate="true" actionListener="#{complexRequest.remove}"
                                       onclick="jsf.ajax.request(this, event, {execute:'r', render:'f:m:t'}); return false;">
                        </h:commandLink>
                </h:column>

                </topless:table>
            </h:form>
        </f:view>
        <ui:debug rendered="true"/>
    </body>
</html>